/**
 * 关于我们
 */

import React from 'react'
import AboutUs1 from '@/assets/img/aboutus1.jpeg'
import AboutUs2 from '@/assets/img/aboutus2.jpeg'
import AboutUs3 from '@/assets/img/aboutus3.jpeg'
import AbIcon from "@/components/DecorateIcons/Ab_Icon"
const data = {
  picture1: AboutUs1,
  picture2: AboutUs2,
  picture3: AboutUs3,
  content: '在平静的海平面上，每个人都可以成为领航员。但如果只有阳光而没有阴影，只有欢乐而没有痛苦，那就不是完整的人生。就拿最幸福的人来说吧——他的幸福是一团纠结的纱线。痛苦和幸福轮番而至，让我们悲喜交集，甚至死亡都让人生更加可爱。人在生命的严肃时刻，在悲伤与丧亲的阴影下，才最接近真实的自我。在生活和事业的各个方面，才智的功能远不如性格，头脑的功能远不如心性，天分远不如自制力、毅力与教养。我始终认为内心开始过严肃生活的人，他外在的生活会开始变得更为俭朴。在一个奢侈浪费的年代，但愿我能让世人了解：人类真正的需求是多么的稀少。不重蹈覆辙才是真正的醒悟。比别人优秀并无任何高贵之处，真正的高贵在于超越从前的自我。'
}

function SystemIntroduction({ home }) {

  return (
    <div className={`system animate__animated animate__${home.base.system_animate}`}>

      {/* 标题 */}
      <div className="title">
        <span className="text">系统简介</span>
        <span className="subtext">SYSTEM INTRODUCTION</span>
      </div >

      <div className="content">

        {/* 图片 */}
        <div className='img-box'>
          <img className='img1' src={data.picture1} />
          <img className='img2' src={data.picture2} />
          <img className='img3' src={data.picture3} />
        </div>


        {/* 内容 */}
        <div className='desc' dangerouslySetInnerHTML={{ __html: data.content }} ></div>
      </div>

      {/* 查看更多 */}
      <div className="more">
        <span className="text">{home.system_more.base.text}</span>
        <AbIcon iconName={home.system_more.base.icon} className='icon' />
      </div >

    </div>

  )
}

export default React.memo(SystemIntroduction)